<template>
	<view class="bg-white">
		
				<view>colorui</view>
		<view class="cu-list grid col-4 border">
			<view class="cu-item" v-for="(item,index) in cuIconList" :key="index">
				<view class="cuIcon-cardboardfill text-blue">
					<view class="cu-tag badge" v-if="item.badge!=0">
						{{item.badge}}
					</view>
				</view>
				<text>{{item.name}}</text>
			</view>
		</view>

		<!-- uview -->
		<view>uview</view>
		<view class="margin-top">
			<u-grid :border="true" col="4">
				<u-grid-item v-for="(baseListItem,baseListIndex) in cuIconList" :key="baseListIndex">
					<u-icon :customStyle="{paddingTop:20+'rpx'}" name="lock" :size="22"></u-icon>
					<text class="grid-text">{{baseListItem.name}}</text>
				</u-grid-item>
			</u-grid>
			<u-toast ref="uToast" />
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				cuIconList: [{
						cuIcon: 'cardboardfill',
						color: 'red',
						badge: 0,
						name: 'VR'
					},
					{
						cuIcon: 'cardboardfill',
						color: 'red',
						badge: 0,
						name: 'VR'
					},
					{
						cuIcon: 'cardboardfill',
						color: 'red',
						badge: 120,
						name: 'VR'
					},
					{
						cuIcon: 'cardboardfill',
						color: 'red',
						badge: 120,
						name: 'VR'
					},
					{
						cuIcon: 'cardboardfill',
						color: 'red',
						badge: 120,
						name: 'VR'
					},
					{
						cuIcon: 'cardboardfill',
						color: 'red',
						badge: 120,
						name: 'VR'
					},
					{
						cuIcon: 'cardboardfill',
						color: 'red',
						badge: 120,
						name: 'VR'
					},
					{
						cuIcon: 'cardboardfill',
						color: 'red',
						badge: 120,
						name: 'VR'
					},
					{
						cuIcon: 'cardboardfill',
						color: 'red',
						badge: 120,
						name: 'VR'
					}
				]
			}
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>

<style>
	 .grid-text {
	        font-size: 14px;
	        color: #909399;
	        padding: 10rpx 0 20rpx 0rpx;
	        /* #ifndef APP-PLUS */
	        box-sizing: border-box;
	        /* #endif */
	    }
</style>